<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>七夕主题</title>
	<link rel="stylesheet" type="text/css" href="css/index.css">
	<link rel="stylesheet" type="text/css" href="css/pageA.css">
</head>
<body>
	<div id="content">
		<ul class="content-wrap">
			<li>
				<div class="a-bag">
					<div class="a-bag-top"></div>
					<div class="a-bag-mid"></div>
					<div class="a-bag-foot"></div>
				</div>
			</li>
			<li>页面2</li>
			<li>页面3</li>
		</ul>
		<div id="boy" class="charector"></div>
		<div class="button"><button>开始</button></div>
	</div>
	<di></di>
</body>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/swipe.js"></script>
<script type="text/javascript" src="js/transition.js"></script>
<script type="text/javascript" src="js/boyAction.js"></script>
<script type="text/javascript">
$(document).ready(function(){ 
	var container = $("#content");
	var swipe =Swipe($("#content"));
	function scrollTo(time,proportionX){
		var distX = container.width()*proportionX;
		swipe.scrollTo(distX,time);
	}

	var boy = boyWalk();
	$(".button button").on("click",function(){
		boy.walkTo(5000,0.2).then(function(){
			scrollTo(5000,1);
		}).then(function(){
			return boy.walkTo(5000,0.5);
			scrollTo(5000,1);
		});
	});
});

</script>
</html>